// ve = vue element
let ve_pet;
$(function () {
    ve_pet = new Vue({
        el: "#pet-data-box",
        data: {
            page_index: 1,
            page_num: 1,
            pets: [],
            pointed_species: "",
            go: 1
        },
        methods: {
            get_paging_data(page) {
                ve_pet.get_pages_amount();
                ve_pet_order.order_button_available = true;

                if (page < 1)
                    page = 1;
                else if (page > ve_pet.page_num)
                    page = ve_pet.page_num;

                ajax_get("/pet/page/" + (page - 1), {
                    species: ve_pet.pointed_species
                }, function (response) {
                    if (response.code == null) {
                        ve_pet.pets = response;
                    }
                }, "Getting paging data of pets")
            },
            get_pages_amount() {
                ajax_get("/pet/page", {
                    species: ve_pet.pointed_species
                }, function (response) {
                    ve_pet.page_num = response;
                }, "Getting pages amount of pets")
            },
            render_modal_box(id) {
                ve_pet_info.pet = ve_pet.pets.find(pet => pet.id === id);
            },
            render_order_modal_box(id) {
                ve_pet_order.pet = ve_pet.pets.find(pet => pet.id === id);
                ve_pet_order.message = "";
                ve_pet_order.credit_number = ve_nav_bar.validation.creditNumber;
                ve_pet_order.credit_password = ve_nav_bar.validation.creditPassword;
            },
            reset_search() {
                ve_pet.pointed_species = "";
                ve_pet.get_paging_data(0);
            },
        }
    });


    let ve_pet_info = new Vue({
        el: "#pet-info",
        data: {
            pet: { species: {} }
        },
        methods: {
            reset_info() {
                ve_pet_info.pet = { species: {} }
            }
        }
    });

    let ve_pet_order = new Vue({
        el: "#pet-order",
        data: {
            image: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1553017684781&di=d18a057285cbc3e9341621b5d9496864&imgtype=0&src=http%3A%2F%2Fcli.clewm.net%2Ffile%2F2014%2F12%2F10%2F10febbdfabe543c7dd27d74fb4f411f3.png",
            pet: {},
            message: "",
            credit_number: "xxx",
            credit_password: "xxx",
            input_password: ""
        },
        methods: {
            create_order() {

                ajax_post("/order/pet", {
                    user: {
                        id: ve_nav_bar.validation.id
                    },
                    pet: {
                        id: ve_pet_order.pet.id
                    }
                }, function (response) {
                    if (response.code == null) {
                        ve_pet_order.message = "已创建订单";
                    }
                    else
                        ve_pet_order.message = response.message;
                    setTimeout(function () {
                        $("#pet-order").modal('hide');
                        window.location.href = "/";
                    }, 1000);
                }, "Creating pet order")
            }
        },
        computed: {
            is_logged_in() {
                return ve_nav_bar.validation.id > 0;
            }
        }
    });

    // Initialization
    ve_pet.get_paging_data(0);
});